* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-size: 14px;
}

a {
	text-decoration: none;
	color: #252525;
}

li {
	list-style: none;
}

.container {
	width: 680px;
	margin: 50px auto;
}

.header {
	background: #ccc8c8;
	padding: 10px;
}

.header input {
	width: 30%;
	line-height: 25px;
	padding-left: 5px;
}

.header span {
	display: inline-block;
	width: 69%;
	text-align: right;
	color: #7e7e7e;
	font-size: 13px;
}

.nav {
	margin-top: 10px;
}

.nav ul {
	overflow: hidden;
}

.nav-top {
	margin-bottom: 10px;
}

.nav-top li {
	float: left;
	width: 25%;
	height: 32px;
	line-height: 32px;
	text-align: center;
	border: 1px solid #fff;
	background: #d0ebff;
}

.nav-top li a {
	color: #252525;
}

.nav-top .active {
	background: #ecf7ff;
}

.nav-top .active a {
	color: #3466bb;
}

.nav-top li:hover {
	background: #ecf7ff;
}

.nav-top li:hover a {
	color: #3466bb;
}

.nav-main {
	border-top: 4px solid #458ff1;
	border-bottom: 1px solid #c0d9f2;
}

.nav-main li {
	float: left;
	width: 14%;
	text-align: center;
	margin-left: 2px;
	padding-bottom: 20px;
	border: 1px solid #dce7ef;
	cursor: pointer;
}

.nav-main li:first-child {
	margin-left: 0px;
}

.nav-main li h1 {
	height: 34px;
	line-height: 34px;
	font-size: 13px;
	font-weight: normal;
}

.nav-main li .type {
	font-size: 13px;
	line-height: 19px;
	height: 36px;
	overflow: hidden;
	margin-top: 12px;
}

.nav-main li .heat {
	height: 30px;
	line-height: 30px;
	margin-top: 5px;
}
.nav-main li .fx{
	height: 30px;
	line-height: 30px;
	margin-top: 15px;
}
.nav-main .active,
.nav-main li:hover {
	background: #e1edfa;
}

.forecast {
	margin-top: 10px;
	border: 1px solid #e9e9e9;
}

.forecast h3,
.life h3 {
	width: 16%;
	font-weight: normal;
	color: #076ea8;
	border: 1px solid #85b8d4;
	cursor: pointer;
	line-height: 24px;
	text-align: center;
}

.forecast ul {
	overflow: hidden;
}

.forecast .time {
	margin-top: 10px;
}

.forecast ul li {
	float: left;
	width: 12.5%;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

.forecast ul li time {
	display: inline-block;
	width: 40px;
	height: 20px;
	font-size: 13px;
	line-height: 20px;
	font-size: 13px;
	line-height: 20px;
	border-radius: 20px;
}

.forecast ul li p {
	line-height: 30px;
	margin-top: 20px;
}
.life {
	margin-top: 20px;
}

.life ul {
	overflow: hidden;
	margin-top: 10px;
}

.life ul li {
	float: left;
	border: 1px solid #fff;
	width: 33.3333%;
	background: #daedff;
	height: 120px;
	overflow: hidden;
}

.life ul li a {
	display: inline-block;
	width: 100%;
	height: 100%;
}

.life-left,
.life-right {
	margin-top: 20px;
}

.life-left {
	width: 40%;
	text-align: center;
	float: left;
}

.life-left p {
	color: #1570a6;
	font-size: 13px;
	margin-top: 15px;
}

.life-right {
	width: 60%;
	float: right;
}

.life-right span {
	color: #187db6;
	font-size: 20px;
	height: 24px;
	line-height: 24px;
}

.life-right p {
	color: #818181;
	font-size: 13px;
	text-align: left;
	width: 129px;
	line-height: 24px;
}

.life ul li:nth-child(2) .life-left p {
	margin-top: 20px;
}

.life ul li:nth-child(3) .life-left p {
	margin-top: 0px;
}

.one,
.two,
.there,
.four,
.five,
.six {
	display: inline-block;
	background-image: url(iconall.png);
	background-size：cover； background-repeat：no-repeat;
}

.one {
	width: 40px;
	height: 40px;
	background-position: -109px -174px;
}

.two {
	width: 60px;
	height: 32px;
	background-image: url(pcjf.png);
}

.there {
	width: 39px;
	height: 54px;
	background-image: url(xt.png);
}

.four {
	width: 43px;
	height: 37px;
	background-position: -56px -354px;
}

.five {
	width: 42px;
	height: 36px;
	background-position: -55px -406px;
}

.six {
	width: 36px;
	height: 36px;
	background-position: -157px -257px;
}

.life ul li:nth-child(2) a,
.life ul li:nth-child(4) a {
	position: relative;
}

.life ul li:nth-child(2) a .seven,
.life ul li:nth-child(4) a .seven {
	display: inline-block;
	width: 25px;
	height: 25px;
	background: url(img_03.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: 0px;
	right: 0px;
	transition: all .8s;
	box-shadow: 0px 1px 5px #959ea6;
}

.life ul li:nth-child(2) a:hover .seven,
.life ul li:nth-child(4) a:hover .seven {
	width: 50px;
	height: 50px;
}